<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="sign.css">
    <title>Title</title>
</head>
<body>
<script>
    function isvalid() {
        if(!/[a-zA-Z0-9]{5,10}/.test(document.getElementById("ID").value))
        {
            alert("ID长度为5到10位英文与数字结合");
            document.getElementById("ID").focus();
            return false;
        }
        else if(localStorage.getItem(document.getElementById("ID").value)!=null)
        {
            alert("该用户名已存在");
            document.getElementById("ID").focus();
            return false;
        }
        else if(!/^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,30}/.test(document.getElementById("PW").value))
        {
            alert("密码强度不够");
            document.getElementById("PW").focus();
            return false;
        }
        else if(document.getElementById("PW").value!=document.getElementById("PW2").value)
        {
            alert("两次密码不一致");
            document.getElementById("PW").focus();
            return false;
        }
        else if(!/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(document.getElementById("MAIL").value))
        {
            alert("邮箱格式不正确");
            document.getElementById("MAIL").focus();
            return false;
        }
        var data={
            id:document.getElementById("ID").value,
            pw:document.getElementById("PW").value,
            email:document.getElementById("MAIL").value
        };
        var d = JSON.stringify(data);
        localStorage.setItem(document.getElementById("ID").value,d);
        alert("注册成功，返回登录页面");
        return true;
    }
</script>
<div id="all">
    <div class="login_header">
    <a href="SighIn.html">登录</a>
    <b class="point">·</b>
    <a href="SignUp.html">注册</a>
    </div>
    <form action="SighIn.html" onsubmit="return isvalid()">
        <input placeholder=" id" type="text" id="ID" class="temp"><br>
        <input placeholder=" 密码" type="password" id="PW" class="temp"><br>
        <input placeholder=" 再输入一次" type="password" id="PW2" class="temp"><br>
        <input placeholder=" 邮箱" type="text" id="MAIL" class="temp"><br>
        <input type="submit" class="click" value="注册">
    </form>
</div>
</body>
</html>